<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <style>
      body {
        background-image: url(./img/v2-eb914abdab236dea6c6d6d65b2914898_r.jpg);
        background-repeat: no-repeat;
        opacity: 0.7;
      }
      .justify-content-end {
        border: 1px solid rgb(197, 197, 197);
      }
      .list-group > li {
        width: 20%;
        text-align: center;
        margin: 10px 0;
        height: 13%;
      }
      h1 {
        text-align: center;
      }
      #aboat {
        text-align: center;
      }
      #aboat > a {
        text-decoration: none;
        color: rgb(83, 83, 83);
      }

      ul > li > .btn-primary {
        background-color: white;
        color: rgb(83, 83, 83);
        border: 0px;
      }
      ul > li:hover {
        background-color: grey !important;
      }
      #x:hover {
        color: rgb(83, 83, 83);
        background-color: grey;
      }
      ul > li > .collapse {
        display: inline;

        border: 0px !important;
      }
      a {
        text-decoration: none !important;
      }
      .table-sm{
        position: absolute;
        width: 70% !important;
        top: 20%;
        left: 25%;
        border: 2px solid rgb(158, 156, 156);
      }
    </style>

    <link
      href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/css/bootstrap.min.css"
      rel="stylesheet"
    />
  </head>
  <body>
    <ul class="nav justify-content-end">
      <li class="nav-item">
        <a class="nav-link active" href="#">个人信息</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">修改信息</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="./学生宿舍管理系统登陆页面.html">退出</a>
      </li>
      <li class="nav-item">
        <img
          src="./img/屏幕截图 2022-03-18 093414.png"
          alt=""
          class="nav-link"
        />
      </li>
    </ul>
    <h1>欢迎登录学生宿舍管理系统</h1>
    <ul class="list-group">
      <li class="list-group-item disabled" aria-disabled="true">信息模块</li>
      <li class="list-group-item">
        <button
          class="btn btn-primary"
          id="x"
          type="button"
          data-toggle="collapse"
          data-target="#collapseExample"
          aria-expanded="false"
          aria-controls="collapseExample"
        >
          管理信息模块
        </button>
        <div class="collapse" id="collapseExample">
          <div class="card card-body">
            <a href="">超级管理员</a>
          </div>
        </div>
        <div class="collapse" id="collapseExample">
          <div class="card card-body">
            <a href="">辅导管理员</a>
          </div>
        </div>
        <div class="collapse" id="collapseExample">
          <div class="card card-body">
            <a href="">宿舍管理员</a>
          </div>
        </div>
      </li>
      <li class="list-group-item">
        <button
          class="btn btn-primary"
          id="x"
          type="button"
          data-toggle="collapse"
          data-target="#collapseExample1"
          aria-expanded="false"
          aria-controls="collapseExample"
        >
          班级管理模块
        </button>
        <div class="collapse" id="collapseExample1">
          <div class="card card-body">
            <a href="./查看班级信息页面.html">查看班级信息</a>
          </div>
        </div>
        <div class="collapse" id="collapseExample1">
          <div class="card card-body">
            <a href="./添加班级信息页面.html">添加班级信息</a>
          </div>
        </div>
      </li>
      <li class="list-group-item"><button
        class="btn btn-primary"
        id="x"
        type="button"
        data-toggle="collapse"
        data-target="#collapseExample2"
        aria-expanded="false"
        aria-controls="collapseExample"
      >
        学生信息模块
      </button>
      <div class="collapse" id="collapseExample2">
        <div class="card card-body">
          <a href="./查看学生信息页面.html">查看学生信息</a>
        </div>
      </div>
      <div class="collapse" id="collapseExample2">
        <div class="card card-body">
          <a href="./添加学生信息页面.html">添加学生信息</a>
        </div>
      </div></li>
      <li class="list-group-item">宿舍信息模块</li>
      <li class="list-group-item">宿舍变动模块</li>
      <li class="list-group-item">系统日志模块</li>
    </ul>
    <table class="table table-sm">
      <thead>
        <tr>
          
          <th scope="col">姓名</th>
          <th scope="col">年级</th>
          <th scope="col">性别</th>
          <th scope="col">所属专业</th>
          <th scope="col">班主任</th>
          <th scope="col">更多</th></th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td>张三</td>
          <td>19级</td>
          <td>男</td>
          <td>软件工程</td>
          <td>付老师</td>
          <td><a href="./学生信息详情页面.html">详情</a><button>删除</button><button class="alter">修改</button></td>
        </tr>
        <tr>
          
          <td>张三</td>
          <td>19级</td>
          <td>男</td>
          <td>软件工程</td>
          <td>付老师</td>
          <td><a href="./学生信息详情页面.html">详情</a><button>删除</button><button class="alter">修改</button></td>
        </tr>
        <tr>
         
          <td>张三</td>
          <td>19级</td>
          <td>男</td>
          <td>软件工程</td>
          <td>付老师</td>
          <td><a href="./学生信息详情页面.html">详情</a><button>删除</button><button class="alter">修改</button></td>
        </tr>
      
      </tbody>
    </table>
    <nav aria-label="Page navigation example">
      <ul class="pagination justify-content-center">
        <li class="page-item disabled">
          <a class="page-link">上一页</a>
        </li>
        <li class="page-item"><a class="page-link" href="#">1</a></li>
        <li class="page-item"><a class="page-link" href="#">2</a></li>
        <li class="page-item"><a class="page-link" href="#">3</a></li>
        <li class="page-item">
          <a class="page-link" href="#">下一页</a>
        </li>
      </ul>
    </nav>

    <div id="aboat">
      <a href="">电子科技大学@1956-2022</a>|<a href="">加入我们</a>|<a href=""
        >合作联系</a
      >|<a href="">联系客服</a>|<a href="">隐私政策</a>
    </div>

    <script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/js/bootstrap.bundle.min.js"></script>
    <script>
      $('.btn-primary').click(function () {
        $('.btn-primary').hover(function () {
          $('.btn-primary').css({
            'background-color': 'white',
            color: 'rgb(83, 83, 83)',
          })
        })
      })
      $(".alter").click(function(){
        window.location.href="./修改学生信息页面.html"
      })
      $('button:contains(删除)').click(function () {
        $(this).parent().parent().remove()
      })
    </script>
  </body>
</html>
